<extend name="public@base"/>
<style>
    .indexCont {
        text-align: center;
        color: black;
        font-size: 18px;
    }
    .indexSlider .hero-slider-item::before {
        background-color: transparent;
    }
</style>
<block name="body">
    <!-- 首页幻灯片 -->
    <div>
        <php>
            $top_slide_id=empty($theme_vars['top_slide'])?1:$theme_vars['top_slide'];
        </php>
        <slides id="$top_slide_id">
            <div class="container" style="position: relative;">
                <a href="{$vo.url|default=''}"><img src="{:cmf_get_image_url($vo.image)}" alt="{$vo.title|default=''}" title="{$vo.title|default=''}" style="width: 100%;user-select: none;"></a>
                <!-- <p class="bgImgText">GET IN TOUCH</p> -->
            </div>
        </slides>
        <noslides id="$top_slide_id">
            <div class="container" style="position: relative;">
                <a href="__ROOT__"><img src="__TMPL__/public/assets/img/bgboat.png" alt="This slide is just a demonstration, you have not set any slides, please go to the background template settings!" title="This slide is just a demonstration, you have not set any slides, please go to the background template settings!" style="width: 100%;user-select: none;"></a>
                <!-- <p class="bgImgText">GET IN TOUCH</p> -->
            </div>
        </noslides>
    </div>
    
    <!-- About us -->
    <widget name="first_section">
        <section class="contact-us-section ptb-100 white-bg" style="padding-top: 30px;padding-bottom: 40px;">
            <div class="container">
                <!--版块内容-->
                <empty name="$widget.vars.category_id">
                    <h3>No information source is set, please set it in the background.</h4>
                    <else/>
                    <!--版块标题-->
                    <php>
                        $where['post.recommended'] = ['eq',1];
                    </php>
                    <portal:articles limit="1"  where="$where" order="post.published_time DESC" categoryIds="$widget.vars.category_id">
                    <h3 class="specialTitle">{$vo.post_title}</h3>
                    <!-- The Line -->
                    <div class="hrLine" style="background: #9e9e9e;"></div>
                    
                    <div class="video-content" style="overflow: hidden;margin-top: 30px;margin-bottom: 30px;background-image: url({$vo.thumbnail|default=$vo.more.thumbnail|cmf_get_image_url});background-repeat: no-repeat;">
                        <div class="d-table"> 
                            <div class="d-tablecell">
                                <div class="sonar-wrapper">
                                    <div class="sonar-emitter" data-tilt>
                                        <a href="{$vo.more.video|default=$vo.more.video|cmf_get_image_url}" class="play-icon popup-youtube">
                                            <i class="icofont-play"></i>
                                        </a>
                                        <div class="sonar-wave"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div>
                        <p class="indexCont">
                            {$vo.post_excerpt}
                        </p>
                        <div class="text-center" style="margin-top:45px;">
                            <!-- <button id="aboutBtn" class="specialBtn">About us</button> -->
                            <a href="{:cmf_url('portal/Article/index',['id'=>$vo.id,'cid'=>$vo.category_id])}" class="specialBtn" >About us</a>
                        </div>
                    </div>
                    </portal:articles>
                </empty>
            </div>
        </section>
    </widget>
    <!-- End About us -->

    <!-- Packages1 -->
    <widget name="second_section">
        <empty name="$widget.vars.category_id">
            No information source is set, please set it in the background.
        <else/>
        <portal:articles limit="6" order="post.published_time DESC"
                                                         field="post.id,category_id,post_title,post_excerpt,published_time,more"
                                                         categoryIds="$widget.vars.category_id">
            <section class="contact-us-section ptb-100 white-bg" style="padding-top: 30px;padding-bottom: 40px;">
                    <div class="container">
                        <h3 class="specialTitle">{$vo.post_title}</h3>
                        
                        <!-- The Line -->
                        <div class="hrLine" style="background: #9e9e9e;"></div>
                        <empty name="$vo.more.photos">
                            <div style="margin-top: 30px;">
                                <img src="{$vo.more.thumbnail|default='__TMPL__/public/assets/img/indexpackage.png'|cmf_get_image_url}" alt="">
                            </div>
                        <else/>
                            <div class="indexSlider" style="margin-top: 30px;">
                                <div class="hero-slider owl-carousel owl-theme owl-theme-1">
                                <foreach name="vo.more.photos" item="st">
                                    <div class="hero-slider-item item-bg-{$key+1}" style="background-image:url({$st.url|default='__TMPL__/public/assets/img/indexpackage.png'|cmf_get_image_url})"></div>
                                </foreach>
                                </div>
                            </div>
                        </empty>
                        <div>
                            <p class="indexCont">
                                {$vo.post_excerpt}
                            </p>
                            <div class="text-center" style="margin-top:45px;">
                                <!-- <button id="packagesBtn1" class="specialBtn">Packages</button> -->
                                <a href="{:cmf_url('portal/Article/index',['id'=>$vo.id,'cid'=>$vo.category_id])}" class="specialBtn" >Packages</a>
                            </div>
                        </div>
                    </div>
            </section>
        </portal:articles>
        </empty>
    </widget>
    <!-- End Packages1 -->
</block>
